<template>
  <el-container>
    <el-header height="36px">
      <header-title :title="headerTitle" />
    </el-header>
    <el-main class="mainDetails">
      <el-collapse v-model="activeNames">
        <el-collapse-item name="independentResearch">
          <template slot="title">
            <i class="item_icon" />项目基础信息
          </template>
          <div class="content-box">
            <iframe
              :src="baseDetailsUrl"
              width="100%"
              height="240"
              frameborder="0"
              scrolling="no"
            />
          </div>
        </el-collapse-item>
      </el-collapse>
      <!-- 基本信息 -->
      <el-collapse v-model="activeNames">
        <el-collapse-item name="independentResearch">
          <template slot="title">
            <i class="item_icon" />项目专属信息
          </template>
          <div class="content-box">
            <iframe
              :src="exclusiveDetailsUrl"
              width="100%"
              height="30"
              frameborder="0"
              scrolling="no"
            />
          </div>
        </el-collapse-item>
      </el-collapse>
      <el-collapse v-model="activeNames">
        <el-collapse-item name="independentResearch">
          <template slot="title">
            <i class="item_icon" />验工计价详情
          </template>
          <div class="content-box">
            <independentResearch />
          </div>
        </el-collapse-item>
      </el-collapse>
    </el-main>
    <div class="flex-layout">
      <el-button
        class="pms-button-primary"
        @click="handleClose"
      >关闭</el-button>
    </div>
  </el-container>
</template>

<script>
import HeaderTitle from '@/components/basic/HeaderTitle'
import independentResearch from './independentResearch'
import {
    updateItAcceptTime,
    getPrjDetailApi,
    getWFWorkItemApi,
    NewgetPrjDetailApi
} from '@/api/acceptanceManagement/acceptanceMange'
import { getQueryObject } from '@/utils'
import { clonePage } from '@/utils'
export default {
    name: 'AcceptMangeDetail',
    components: {
        HeaderTitle,
        independentResearch
    },
    data() {
        return {
            prjDetail: {
                prjId: '',
                btnType: '',
                pageType: ''
            },
            headerTitle:
                '铁塔IT系统2023年自主研发项目-XXXXX平台-IT验工计价-验工计价xxx',
            prjId: '',
            activeNames: ['independentResearch'],
            baseDetailsUrl: '',
            siteDetailsUrl: '',
            exclusiveDetailsUrl: '',
            attachmentInfoUrl: '',
            handleRecordUrl: '',
            workItemId: '',
            fileObj: {
                nodeId: '',
                prjStage: 1,
                prjType: 1,
                buildModes: 1,
                towerType: 0,
                roomType: 0,
                isChange: 1,
                operateType: 1,
                btnConfig: 'B'
            }
        }
    },
    computed: {
        buttonDisable() {
            /**
             * 各个阶段对应的编码
             * F4  资源录入
             * F5  资源确认
             * F10 验收申请
             * F11 验收审核
             * F91 初验申请
             * F92 初验审核
             * F93 终验申请
             * F94 终验审核
             */
            if (['F4', 'F10', 'F93', 'F91'].includes(this.prjDetail.btnType)) {
                return ['save', 'doNext', 'close']
            }
            if (['F5', 'F11', 'F92', 'F94'].includes(this.prjDetail.btnType)) {
                return ['save', 'doNext', 'back', 'close']
            }
            return ['save', 'doNext', 'back', 'close']
        }
    },
    created() {
        // 获取路径的prjId  30007957
        const {
            prjId,
            workItemId
        } = getQueryObject()
        this.prjId = prjId
        this.prjDetail.prjId = prjId
        this.workItemId = workItemId
        this.getPrjDetail()
        this.setIframeUrl()
    },
    methods: {
        setIframeUrl() {
          const _res1 = this.fileObj.prjType ==='M' ? 'design/basicInfo' :'design/projectBasicInfo'
          const _res2 = this.fileObj.prjType ==='M' ? 'design/proprietaryInfo' :'design/projectProprietaryInfo'
            this.baseDetailsUrl = `${process.env.VUE_APP_JUNNAN_IFRAME_URL}${_res1}?prjId=${this.prjId}`
            console.log(this.baseDetailsUrl, 11111)
            this.siteDetailsUrl = `${process.env.VUE_APP_JUNNAN_IFRAME_URL}design/siteInfo?prjId=${this.prjId}`
            this.exclusiveDetailsUrl = `${process.env.VUE_APP_JUNNAN_IFRAME_URL}${_res2}?prjId=${this.prjId}&secondaryType=12`
            this.handleRecordUrl = `${process.env.VUE_APP_JUNNAN_IFRAME_URL}workflow/taskDetail/handleRecord?prjId=${this.prjId}&secondaryType=M`
            this.attachmentInfoUrl = `${process.env.VUE_APP_ZHONGRUAN_URL}attachmentInfo?prjId=${this.prjId}&btnConfig=B`
        },
        // 返回上一步
        handleClose() {
            clonePage()
        },
        // 审核退回
        handleBack() {
          console.log('[]')
        },
        getPrjDetail() {
            getPrjDetailApi(this.prjId).then((res) => {
                console.log(res, 'res')
                this.prjDetail.pageType = +res.data?.SECONDARYTYPE
                this.fileObj.prjType = +res.data?.PRJTYPE
                this.fileObj.buildModes = +res.data?.BUILDMODES
                 this.headerTitle = `${res.data.PROJECTNAME}`
            })
            NewgetPrjDetailApi(this.prjId).then(r=>{
              this.headerTitle = r?.data?.prjName
            })
            if (this.workItemId) {
                getWFWorkItemApi(this.workItemId).then((res) => {
                this.prjDetail.btnType = res.data?.bizObject?.bizState
                this.fileObj.prjStage = res.data?.bizObject?.wfStage
                this.fileObj.nodeId = res.data?.activityDefID
                this.headerTitle = `${res.data.processInstName}`
            })
            }
        },
        // 保存IT信息化项目验收时间
        handleSave() {
            const res = this.$refs['prjAcceptInfo'].submit()
            if (res.success) {
                updateItAcceptTime(res.data).then((res_) => {
                    this.$message.success('保存成功')
                })
            } else {
                this.$message.warning(res.message)
            }
        }
    }
}
</script>

<style lang="scss" scoped>
.el-collapse {
    margin-bottom: 20px;
}

.el-collapse-item {
    box-shadow: 0px 0px 6px 0px rgba(191, 192, 192, 0.52);
    /* 调整各个item之间的距离为20px */
    /* border: 1px; */
}

.el-collapse-item__wrap {
    padding: 0 20px;
    /* 为el-collapse-item的内容添加20像素的padding */
}

.el-collapse-item__header {
    padding-left: 20px;
    font-size: 14px;
    color: #333333;
    letter-spacing: 0;
    font-weight: 600;
}

.item_icon {
    width: 6px;
    background: rgb(235, 75, 75);
    height: 15px;
    margin-right: 10px;
    border-radius: 10px;
}

.content-box {
    width: 100%;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 400;
    line-height: 25px;
}
.flex-layout {
    display: flex;
    width: 100%;
    height: 60px;
    background: #fff !important;
    border: 1px solid #ebeef5;
    transition: border-bottom-color 0.3s;
    align-items: center;
    justify-content: center;
}
</style>
